<!--
 * @Author: 汪军 624473119@qq.com
 * @Date: 2023-10-10 18:15:53
 * @LastEditors: 汪军 624473119@qq.com
 * @LastEditTime: 2023-12-12 09:32:31
 * @FilePath: \ekee-web\src\views\end\easy-link\EasyLink.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template lang="pug">
.my-attention.relative.h100
  div.container.overflow-y
    EnterpriseCenterTitle(:titleList="titleList")
    .mt4.px4(v-if="attentionList.length > 0")
      div(v-for="(item, index) in attentionList", :key="index")
        AttentionFansCard(:item="item", @change="onAttention")
    Empty(v-else)
  //- 分页
  TablePagination(
    v-if="totalList > 0",
    :totalList="totalList",
    :page="FanAttentionPage.page",
    @handleCurrentChange="handleCurrentChange")
</template>

<script setup>
import { ref, getCurrentInstance, onMounted } from "vue";
import AttentionFansCard from "@/components/AttentionFansCard.vue";
import MyPagination from "@/components/pagination.vue";
import Empty from "@/components/Empty.vue";

import { FanAttention, FanDelete } from "@/api/barterhall";

const { proxy } = getCurrentInstance();
const titleList = ref([
  {
    name: "关注",
    value: 0,
  },
]);

onMounted(() => {
  getFanAttention();
});

//数据总条数
const totalList = ref(0);

const FanAttentionPage = ref({
  page: 1,
  page_size: 10,
});
const getFanAttention = () => {
  FanAttention(FanAttentionPage.value).then((res) => {
    attentionList.value = res.data.data;
    console.log('avatar',attentionList.value);
    totalList.value = res.data.total; //总条数
    titleList.value[0].value=res.data.total
  });
};

//翻页
const handleCurrentChange = (val) => {
  FanAttentionPage.value.page = val;
  getFanAttention();
};

const attentionList = ref([]);

// 取消关注
const isFlag=ref(true)
const onAttention = (item) => {
  if(!isFlag.value) return;
  isFlag.value = false
  FanDelete({ id: item.id }).then((res) => {
    if (res.code == 1) {
      isFlag.value=true
      ElMessage({ message: res.msg, type: "success" });
      getFanAttention();
    }
  });
};
</script>

<style lang="stylus" scoped>
.my-attention {
  .container {
    height: calc(100vh - 204px);
  }

  .no-attention {
    margin-top: 200px;
  }
}
</style>
